<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
        
        <title>Racer</title>

        <style>
            body, html {
                margin: 20px;
                padding: 0;
                background-color: #000;
                position: absolute;
            }
            
            body div {
                 position: absolute;
                 -moz-select: none;
                 -webkit-select: none;
                 select: none;
             }

			#building {
				width: 700px;
				height: 300px;
				overflow: hidden;
				-webkit-transform: scale(0.75); /* Just to fit in the HTML5Rocks iFrame */
				-moz-transform: scale(0.75);
				-ms-transform: scale(0.75);
				-o-transform: scale(0.75);
				left: -80px;
				top: -50px;
			}
			
			#building .track {
				width: 700px;
				height: 300px;
				background: url(img/track.png) 0 0 no-repeat;
				background-size: 100%;
				z-index: 2;
			}
			
			#building .scan {
				width: 8px;
				height: 296px;
				top: 2px;
				left: -80px;
				background: rgba(255,255,255,0.5);
				z-index: 3;
				-webkit-animation: wipe 1.3s linear 0s infinite;
			}
			
			#building .glow {
				width: 290px;
				height: 290px;
				background: url(img/track-glow.png) 0 0 no-repeat;
				background-size: 100%;
				top: 0px;
				left: -290px;
				z-index: 1;
				-webkit-animation: wipe 1.3s linear 0s infinite;
			}

			@-webkit-keyframes wipe
			{
				0%   { -webkit-transform: translate(-300px,0); }
				25%  { -webkit-transform: translate(-300px,0); }
				75%  { -webkit-transform: translate(920px,0); }
				100%  { -webkit-transform: translate(920px,0); }
			}
        </style>
</head>
<body>
	<div id="building">
		<div class="scan"></div>
		<div class="glow"></div>
		<div class="track"></div>
	</div>
</body>
</html>
    